<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="format-detection" content="telephone=no">
    <title>打卡</title>
    <!-- css样式 -->
    <link rel="stylesheet" href="${data:dependencies.cmp}/css/cmp.css${data:buildversion}"/>
    <link rel="stylesheet" href="${data:dependencies.cmp}/css/cmp-2.0.0.css${data:buildversion}"/>
    <link rel="stylesheet" href="${data:dependencies.cmp}/css/cmp-2.0.0.css${data:buildversion}"/>
    <!--<link rel="stylesheet" href="${data:dependencies.cmp}/css/cmp-picker.css${data:buildversion}"/>-->
    <link rel="stylesheet" href="${data:dependencies.attendance}/fonts/iconfont.css${data:buildversion}"/>
    <link rel="stylesheet" href="${data:dependencies.attendance}/css/clock_component/clockbase.css${data:buildversion}"/>
    <link rel="stylesheet" href="${data:dependencies.attendance}/css/clock_component/map.css${data:buildversion}"/>
    <link rel="stylesheet" href="${data:dependencies.attendance}/css/clockIndex.css${data:buildversion}"/>
</head>
<body class="attendance-page cmp-fullscreen flex-v">
${data:initScript}
<script>
    ;(function () {
        var serverId = window.localStorage['curServerId'] || '',
            userId = window.localStorage['curUserId'] || '',
            fontType = window.localStorage['fontType-' + serverId + '-' + userId] || 'cmp-font-type-12';
        document.body.className += ' cmp-font-type-' + fontType;
    })();
</script>
<!-- js引入 -->
<header class="cmp-bar cmp-bar-nav cmp-flex-header">
    <div id="backBtn" class="cmp-action-back cmp-header-left ">
        <span class="cmp-icon see-icon-v5-common-arrow-back"></span>
        <span class="nav-text cmp-font-title">返回</span>
    </div>
    <div class="cmp-title cmp-font-btitle" id="page-header-title">
        打卡
    </div>
    <div class="cmp-header-right">
    </div>
</header>
<div class="flex-1 clock-cmp-content flex-v" id="main-view">
    <!--打卡页面-->
  <div class="flex-1 flex-v page-view" id="clock-page">
      <div class="clock-map-warp">
          <div class="map-warp" id="map-warp"></div>
          <div class="month-button button cmp-font-label"><span class="see-icon-v5-common-workingaffair"></span><span id="map-month-date">10月25日 星期二</span></div>
          <!--<div class="local-button button cmp-font-label"><span class="see-icon-relocation"></span>定位</div>-->
          <div class="localResult cmp-font-content flex x-between y-center">
              <p class="address flex y-center"><span class="see-icon-v5-common-location icon"></span><span class="flex-1">静芯园大厦O座</span></p>
              <!--<span class="see-icon-arrow-right"></span>-->
          </div>
      </div>
  </div>
    <!--统计页面-->
  <div class="flex-1 flex-v page-view" id="statistics-page">
      <div class="nav-menu-list flex-h y-center statistics-person-calcH statistics-top-calcH">


      </div>
      <div class="flex-1 flex-v">
          <!--本期暂不开放 管理员日月统计START-->
         <!-- &lt;!&ndash;日统计&ndash;&gt;
          <div class="flex-1 flex-v page-view" id="statistics-day">
              <div class="page-warp flex-1 scroll-touch">
                <div class="chart-zone">
                    <div class="select-zone flex-h x-between y-center">
                        <div class="select-month cmp-font-content">2018.10.06 <span class="see-icon-arrow-plane-down"></span></div>
                        <div class="person-num cmp-font-content" id="depart-person-num">全部部门 <span class="see-icon-arrow-plane-down"></span></div>
                    </div>
                    <div class="flex-h x-center y-center chart-warp">
                        &lt;!&ndash;这是图表&ndash;&gt;
                    </div>
                    <div class="clock-type-menu flex-h">
                        <div class="item flex-1">
                            <div class="item-warp">
                                <p class="text-over-ellipsis cmp-font-btitle warning" id="day-type-late">0</p>
                                <p class="text-over-ellipsis">迟到</p>
                            </div>
                        </div>
                        <div class="item flex-1">
                            <div class="item-warp">
                                <p class="text-over-ellipsis cmp-font-btitle warning" id="day-type-leaveEarly">0</p>
                                <p class="text-over-ellipsis">早退</p>
                            </div>
                        </div>
                        <div class="item flex-1">
                            <div class="item-warp">
                                <p class="text-over-ellipsis cmp-font-btitle error" id="day-type-missingClock">0</p>
                                <p class="text-over-ellipsis">缺卡</p>
                            </div>
                        </div>
                        <div class="item flex-1">
                            <div class="item-warp">
                                <p class="text-over-ellipsis cmp-font-btitle normal" id="day-type-outside">0</p>
                                <p class="text-over-ellipsis">外勤</p>
                            </div>
                        </div>
                    </div>
                 </div>
                <div class="department-list-zone">
                  <div class="item flex-h x-between y-center">部门出勤情况</div>
                  <div class="item-group">
                      <div class="item flex-h x-between y-center">
                         <p>用户体验部</p>
                          <p class="num">
                              <span>3</span>/20
                          </p>
                      </div>
                      <div class="item flex-h x-between y-center">
                          <p>用户体验部</p>
                          <p class="num">
                              <span>3</span>/20
                          </p>
                      </div>
                      <div class="item flex-h x-between y-center">
                          <p>用户体验部</p>
                          <p class="num">
                              <span>3</span>/20
                          </p>
                      </div>
                      <div class="item flex-h x-between y-center">
                          <p>用户体验部</p>
                          <p class="num">
                              <span>3</span>/20
                          </p>
                      </div>
                  </div>

                </div>
              </div>
          </div>
          &lt;!&ndash;月统计&ndash;&gt;
          <div class="flex-1 flex-v page-view" id="statistics-month">
              <div class="select-zone flex-h x-between y-center">
                  <div class="select-month cmp-font-content">2018.10 <span class="see-icon-arrow-plane-down"></span></div>
                  <div class="person-num cmp-font-content">考勤人数20人</div>
              </div>
              <div class="list-zone flex-1 scroll-touch">

              </div>

          </div>-->
          <!--本期暂不开放 管理员日月统计--END-->
          <!--个人统计-->
          <div class="flex-1 flex-v page-view" id="statistics-person">
              <div class="select-zone flex-h x-between y-center statistics-person-calcH">
                  <div class="select-month cmp-font-content"></div>
                  <div class="go-month-detail cmp-font-content"><span class="see-icon-m3-schedule"></span> 打卡月历</div>
              </div>
              <div class="list-zone flex-1 scroll-touch">

              </div>
          </div>
          <!--早到榜-->
          <div class="flex-1 flex-v page-view" id="statistics-top">
              <div class="select-zone flex-h x-between y-center statistics-top-calcH">
                  <div class="select-month cmp-font-content"></div>
                  <div class="person-num cmp-font-content"></div>
              </div>
              <div class="list-zone flex-1 scroll-touch">
                <!--<div class="top-item flex-h y-center">-->
                    <!--<div class="num-text cmp-font-desc">1</div>-->
                    <!--<div class="user-header"></div>-->
                    <!--<div class="user-info-zone flex-1 flex-h x-between y-center">-->
                        <!--<div class="user-info">-->
                            <!--<p class="username cmp-font-title">我</p>-->
                            <!--<p class="department cmp-font-asswords">用户体验部</p>-->
                        <!--</div>-->
                        <!--<span class="clock-time cmp-font-title">07:45</span>-->

                    <!--</div>-->
                <!--</div>-->
                  <!--<div class="top-three-zone">-->
                      <!--<img src="./../img/topbg.png">-->
                      <!--<div class="three-item one">-->
                          <!--<p class="time"> </p>-->
                          <!--<p class="name cmp-font-title"> </p>-->
                          <!--<div class="user-info">-->
                              <!--<div class="header"></div>-->
                          <!--</div>-->
                      <!--</div>-->
                      <!--<div class="three-item two">-->
                          <!--<p class="time"> </p>-->
                          <!--<p class="name cmp-font-title"> </p>-->
                          <!--<div class="user-info">-->
                              <!--<div class="header"></div>-->
                          <!--</div>-->
                      <!--</div>-->
                      <!--<div class="three-item three">-->
                          <!--<p class="time"> </p>-->
                          <!--<p class="name cmp-font-title"> </p>-->
                          <!--<div class="user-info">-->
                              <!--<div class="header"></div>-->
                          <!--</div>-->
                      <!--</div></div>-->
                  <!--<div class="top-item flex-h y-center">-->
                      <!--<div class="num-text cmp-font-desc">1</div>-->
                      <!--<div class="user-header"></div>-->
                      <!--<div class="user-info-zone flex-1 flex-h x-between y-center">-->
                          <!--<div class="user-info">-->
                              <!--<p class="username cmp-font-title">我</p>-->
                              <!--<p class="department cmp-font-asswords">用户体验部</p>-->
                          <!--</div>-->
                          <!--<span class="clock-time cmp-font-title">07:45</span>-->

                      <!--</div>-->
                  <!--</div>-->
                  <!--<div class="top-item flex-h y-center">-->
                      <!--<div class="num-text cmp-font-desc">1</div>-->
                      <!--<div class="user-header"></div>-->
                      <!--<div class="user-info-zone flex-1 flex-h x-between y-center">-->
                          <!--<div class="user-info">-->
                              <!--<p class="username cmp-font-title">我</p>-->
                              <!--<p class="department cmp-font-asswords">用户体验部</p>-->
                          <!--</div>-->
                          <!--<span class="clock-time cmp-font-title">07:45</span>-->

                      <!--</div>-->
                  <!--</div>-->

              </div>
          </div>
      </div>

  </div>
    <!--足迹页面-->
  <div class="flex-1 flex-v page-view" id="foot-page"></div>
    <!--设置页面-->
  <div class="flex-1 flex-v page-view" id="setting-page"></div>
</div>
<footer id ="page-footer" class="display_none page-footer flex-h cmp-bar cmp-bar-footer cmp-before-line">
    <!--<div class="flex-1 text-center flex-h x-center y-center">-->
        <!--<div class="item">-->
            <!--<div class="click-zone clock" data-type="clock">-->
                <!--<p class="icon-warp">-->
                    <!--<span class="icon now see-icon-clock-plan"></span>-->
                    <!--<span class="icon not see-icon-clock"></span>-->
                <!--</p>-->
                <!--<p class="title">打卡</p>-->
            <!--</div>-->

        <!--</div>-->
        <!--<div class="item">-->
            <!--<div class="click-zone" data-type="statistics">-->
                <!--<p class="icon-warp">-->
                    <!--<span class="icon now see-icon-statistics-plan"></span>-->
                    <!--<span class="icon not see-icon-statistics1"></span>-->
                <!--</p>-->
                <!--<p class="title">统计</p>-->
            <!--</div>-->

        <!--</div>-->
        <!--<div class="item">-->
            <!--<div class="click-zone" data-type="foot">-->
                <!--<p class="icon-warp">-->
                    <!--<span class="icon now see-icon-footmark-plan"></span>-->
                    <!--<span class="icon not see-icon-footmark"></span>-->
                <!--</p>-->
                <!--<p class="title">足迹分布</p>-->
            <!--</div>-->
        <!--</div>-->
        <!--<div class="item">-->
            <!--<div class="click-zone" data-type="setting">-->
                <!--<p class="icon-warp">-->
                    <!--<span class="icon now see-icon-set-plan"></span>-->
                    <!--<span class="icon not see-icon-MySettings"></span>-->
                <!--</p>-->
                <!--<p class="title">设置</p>-->
            <!--</div>-->

        <!--</div>-->
    <!--</div>-->
</footer>
<script src="${data:dependencies.attendance}/i18n/clock_zh_CN.js${data:buildversion}"></script>
<script src="${data:dependencies.commons}/i18n/Commons_zh_CN.js${data:buildversion}"></script>
<script src="${data:dependencies.cmp}/js/cmp-i18n.js${data:buildversion}"></script>
<script>
    var $buildversion = '${data:buildversion}';
    var attendancePath = "${data:dependencies.attendance}";
    var cmpPath = "${data:dependencies.cmp}";
    var commonPath = "${data:dependencies.commons}";
    cmp.i18n.init("${data:dependencies.attendance}/i18n/", "clock", function () {
    });
    cmp.i18n.init("${data:dependencies.commons}/i18n/", "Commons");
</script>
${data:cordova}
<script type="text/javascript" src="https://webapi.amap.com/maps?v=1.3&key=dced395ba47d88fd4dcf8ed6d846cbc7"></script>
<script type="text/javascript" src="${data:dependencies.cmp}/js/cmp.js${data:buildversion}"></script>
<script type="text/javascript" src="${data:dependencies.cmp}/js/cmp-2.0.0.js${data:buildversion}"></script>
<script type="text/javascript" src="${data:dependencies.cmp}/js/cmp-asyncLoad.js${data:buildversion}"></script>
<script type="text/javascript" src="${data:dependencies.attendance}/js/clockMap.js${data:buildversion}"></script>

<!--<script type="text/javascript" src="${data:dependencies.cmp}/js/cmp-picker.js${data:buildversion}"></script>-->
<!--<script type="text/javascript" src="${data:dependencies.cmp}/js/cmp-dtPicker.js${data:buildversion}"></script>-->
<script type="text/javascript" src="${data:dependencies.jssdk}${data:buildversion}" id="__jsdktag"></script>
<script type="text/javascript" src="${data:dependencies.attendance}/js/clockbase.js${data:buildversion}"></script>
<script type="text/javascript" src="${data:dependencies.attendance}/js/clockIndex.js${data:buildversion}"></script>
</body>
</html>

